<%@include file="/WEB-INF/jsp/common/taglibs.jsp"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>


<s:layout-render name="/WEB-INF/jsp/common/layout_main.jsp"
                 title="Welcome Screen">
    <s:layout-component name="body">
        <s:messages/>
        <script type="text/javascript">

            jQuery(document).ready(function() {
                jQuery('#mycarousel').jcarousel({
                    wrap: 'circular'
                });
            });
            
        function validate()
        {
            if(document.getElementById('groupname').value == "")
            {
               document.getElementById('groupname').value = "All";
            }
        }

            function validate()
            {
                if(document.getElementById('groupname').value == "")
                {
                    document.getElementById('groupname').value = "group";
                }
            }
        </script>
        <div style="width: 1185px;">
            <div id="divleft"> 
                <div id="divwelcome">
                    <span>&nbsp;Welcome!</span> <br/><br/>
                    <d:table name="${actionBean.context.currentUser}" id="user1">
                        <d:column>
                            <img align="left" border="0" src="${actionBean.context.currentUser.photo}" width="90px" height="100px" style="margin-left:10px; margin-right:10px;">
                        </d:column>
                        <d:column title=" " property="userName" style="color: #003C4C; font-size: 12pt; font-style: normal; font-weight: bold; font-family:Tahoma; "/>
                    </d:table>

                </div>
                <br/><br/>
                <!-- My Group List-->
                <div class="divborder1" style="width:280px;" align="center">
                    <div class="boxTitle1"><div class="boxTitle2">My Group List</div></div>
                    <div class="boxMiddle"><div style="margin-top:8px; margin-left:10px;">List of all my groups and Roles</div></div>
                    <div  id="wrapgroup">
                        <c:forEach var="myGroups" items="${actionBean.myGroups}" >
                            <c:forEach var="usr" items="${myGroups.users}">
                                <div class="boxtag" onmouseout="style.backgroundColor='white'" onmouseover="style.backgroundColor='#84C1DF'">
                                    <c:if test="${empty myGroups.logo}">
                                        <div><img class="boxtagImg"   alt="" align="left" border="0" width="51px" height="51px" src="images/advertising.jpg"></div>
                                        </c:if>
                                        <c:if test="${not empty myGroups.logo}">
                                        <div><img class="boxtagImg"   alt="" align="left" border="0" width="51px" height="51px" src="${myGroups.logo}"></div>
                                        </c:if>
                                        <s:link  class="boxtagTitle" style="text-decoration: none;" beanclass="spatialmarketplace.cem.action.DashboardActionBean" event="view">
                                        <div class="boxtagTitle" align="left">${fn:substring(myGroups.name,0,30)}</div>
                                        <s:param name="groupId" value="${myGroups.groupId}"/>
                                    </s:link>
                                    <div class="boxtagText">${usr.position}</div>

                                </div>
                            </c:forEach>
                        </c:forEach>
                    </div><!-- End wrap  -->
                    <div class="boxfooter" style="height:10px;"></div>
                </div>
                <!-- My Group List-->
                <br/><br/><br/>

            </div>
            <div id="divright" style="margin-left: 0px;">
                <!-- Search for a Group -->
                <br/><br/>
                <s:form beanclass="spatialmarketplace.cem.action.WelcomeScreenActionBean">
                    <div class="divborder1" style="width:650px;">
                        <div class="boxTitle1"><div class="boxTitle2">Search for a Group</div></div>
                        <div class="boxMiddle" style="height:60px;text-align:center;"> 
                            <div style="margin-left:25px; margin-top: 15px;">
                                <s:text name="group.name" class="inputText" value="Search for a Group" onclick="this.value='';" id="groupname" />
                                <s:submit name="search" value="Search" onclick="validate();"/> 
                                <s:param name="userId" value="${actionBean.context.userId}"/>
                            </div>
                        </div>
                    </s:form>  
                    <div  id="wrapgroupsearch">
                        <c:forEach var="grp" items="${actionBean.groupsResults}" >
                            <div class="boxtag">
                                <c:if test="${empty grp.logo}">
                                    <div><img class="boxtagImg"   alt="" align="left" border="0" width="68px" height="51px" src="images/advertising.jpg"></div>
                                    </c:if>
                                    <c:if test="${not empty grp.logo}">
                                    <div><img class="boxtagImg"   alt="" align="left" border="0" width="68px" height="51px" src="${grp.logo}"></div>
                                    </c:if>                  
                                <div class="boxtagTitle" style="width: 500px;" align="left">${fn:substring(grp.name,0,50)} </div>
                                <div class="boxtagText" style="width: 400px; height: 50px;">${fn:substring(grp.description,0,200)}...</div>
                                <div style="float:right; position:relative; margin-right:35px;">
                                    <div align="left" class="buttonCreate" style="width: 80px;">            
                                        <s:link  class="btnSearch" beanclass="spatialmarketplace.cem.action.WelcomeScreenActionBean" event="join">
                                            Join Group
                                            <s:param name="groupId" value="${grp.groupId}"/>
                                            <s:param name="name" value="${grp.name}"/>
                                            <s:param name="userId" value="${actionBean.context.userId}"/>

                                        </s:link>
                                    </div>

                                </div>

                            </div> 
                        </c:forEach>
                    </div><!-- End wrap  -->


                    <div class="boxfooter" style="height:40px;">
                        <div align="left" class="buttonCreate" style="margin-top: 10px; margin-left: 10px;">
                            <s:link  beanclass="spatialmarketplace.cem.action.CreateGroupFormActionBean" style="">
                                Create a New Group
                            </s:link>
                        </div>
                    </div>
   
                </div>
                <!-- Search for a Group -->
                <br/><br/>
                <div class="linediv" style="border:1px solid #999; width: 740px;"></div>
                <br/><br/>
                <div id="addwelcome">
                <%@ include file="advertising.jsp" %>
                </div>

            </div>
        </div>
    </s:layout-component>
</s:layout-render>

<!--Hola esto es una prueba -->
